import {Component} from "react";
import Taro from '@tarojs/taro';
import {Image, Label, Text, View} from "@tarojs/components";
import './topicitem.less'
import { myTimeToLocal } from '../../utils/date'

class Topicitem extends Component{

  gotoDetail(item: any){
    Taro.navigateTo({url: '/detail/pages/detail/detail?topicId=' + item.id});
  };

  render() {
    // @ts-ignore
    const {item} = this.props;
    return (
      <View className='topiclist__item' onClick={()=>this.gotoDetail(item)}>
        <Image className='topiclist__item-img' src={item?.author?.avatar_url || ''} />
        <View className='topiclist__item-content'>
          <View className='topiclist__item-content-top'>
            {
              item.top ? (<View className='topiclist__item-content-top-up'><Text>置顶</Text></View>)
                : (item.tab==='share') ? (<View className='topiclist__item-content-top-up blue'><Text>分享</Text></View>)
                : (<View className='topiclist__item-content-top-up blue'><Text>问答</Text></View>)
            }
            <Label className='topiclist__item-content-top-title'>{item.title}</Label>
          </View>
          <View className='topiclist__item-content-bottom'>
            <Text className='topiclist__item-content-bottom-text'>{item?.author?.loginname || ''}</Text>
            <Text className='topiclist__item-content-bottom-text'>{item?.reply_count || '0'} / {item?.visit_count}</Text>
            <Text className='topiclist__item-content-bottom-text'>{myTimeToLocal(item?.create_at)}</Text>
          </View>
        </View>
      </View>
    );
  }
}
export default Topicitem;
